<template>
  <div class="dashboard-container">
    <!-- 今日报表统计 -->
    <el-row type="flex" justify="center">
      <el-col :span="23">
        <div class="grid-content bg-purple-dark">
          <div style="margin:20px 0px 0px 30px">
            {{ $t("home.today_attendance_statistics") }}：
          </div>
          <el-row
            :gutter="20"
            type="flex"
            justify="space-around"
            style="margin-top:30px"
          >
            <el-col
              :span="7"
              style="background-color:#ccc;height:30px;text-align:center;line-height:30px;font-size:14px"
              >{{ $t("home.should_attend") }}：<span>{{list.employee}}</span></el-col
            >
            <el-col
              :span="7"
              style="background-color:#67C23A;height:30px;text-align:center;line-height:30px;font-size:14px;color:#FFF"
              >{{ $t("home.number_of_attendance") }}：<span>{{list.employeeAttendance}}</span></el-col
            >
            <el-col
              :span="7"
              style="background-color:#F56C6C;height:30px;text-align:center;line-height:30px;font-size:14px;color:#FFF"
              >{{ $t("home.number_of_absentees") }}：<span>{{list.abense}}</span></el-col
            >
          </el-row>
        </div>
      </el-col>
    </el-row>
    <!--今日体温统计   -->
    <el-row type="flex" justify="center">
      <el-col :span="23">
        <div class="grid-content bg-purple-dark">
          <div style="margin:20px 0px 0px 30px">
            {{ $t("home.today_temperature_statistics") }}：
          </div>
          <el-row
            :gutter="20"
            type="flex"
            justify="space-around"
            style="margin-top:30px"
          >
            <el-col
              :span="7"
              style="background-color:#ccc;height:30px;text-align:center;line-height:30px;font-size:14px;"
              >{{ $t("home.number_of_people_taking_temperature") }}：<span>{{list.temp}}</span></el-col
            >
            <el-col
              :span="7"
              style="background-color:#67C23A;height:30px;text-align:center;line-height:30px;font-size:14px;color:#FFF"
              >{{ $t("home.number_of_normal_body_temperature") }}：<span>{{list.tempI}}</span></el-col
            >
            <el-col
              :span="7"
              style="background-color:#F56C6C;height:30px;text-align:center;line-height:30px;font-size:14px;color:#FFF"
              >{{ $t("home.number_of_abnormal_body_temperature") }}：<span>{{list.tempError}}</span></el-col
            >
          </el-row>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { service_getList } from "@/api/index/index";
import store from '@/store'
export default {
  data() {
    return {
      list: null
    };
  },
  computed: {},
  created() {
    this.getList()
  },
  methods: {
    //获取每日数据
    getList() {
      service_getList(store.getters.token).then(res => {
        console.log(res)
        this.list = res.data.data
      })
    }
  }
};
</script>
<style scoped>
.grid-content {
  margin-top: 140px;
  height: 180px;
  border: 2px solid #ccc;
}
</style>
